<template>
  <div>
    <div :class="reversed ? 'active' : ''">{{ msg }}</div>
    <button @click="onReverse">反转</button>
  </div>
</template>

<script>
export default {
  data () {
    return {
      msg: 'hello world',
      reversed: false,
    };
  },
  methods: {
    onReverse () {
      this.reversed = !this.reversed;
    },
  },
}
</script>

<style scoped>
div {
  display: inline-block;
}
.active {
  transform: rotateY(180deg);
}
</style>
